<template>
    <Card>
      <VerticalToggle>
        <MldSearch ref="search" v-if="searchable" class="search" @on-search="handleSearch(...arguments, vm)"></MldSearch>
      </VerticalToggle>
      <Row class="mld-toolbar" style="margin-bottom:10px;">
        <Col span="16">
          <Button v-has="'admin,wzyy:applyRecord:save'" shape="circle" type="primary" icon="md-add" @click="openAdd(vm)">{{vm.$t('add')}}</Button>
          <Button :disabled="selection.length!=1" v-has="'admin,wzyy:applyRecord:update'" shape="circle" type="success" icon="ios-create" @click="openEdit(vm)">{{vm.$t('edit')}}</Button>
          <Poptip confirm :title="vm.$t('delete-tips')" @on-ok='handleRemove(selection, vm)'>
             <Button :disabled="selection.length==0" v-has="'admin,wzyy:applyRecord:remove'" shape="circle" type="error" icon="md-close">{{vm.$t('delete')}}</Button>
          </Poptip>
          <Poptip confirm :title="'更新状态至摇号中'" @on-ok='handleUpdateStatusToWaitLot(vm)'>
            <Button v-has="'admin,wzyy:applyRecord:updateStatusToWaitLot'" shape="circle" type="info" icon="md-copy">更新状态至摇号中</Button>
          </Poptip>
          <Button v-has="'admin,wzyy:applyRecord:exportToCloudbae'" shape="circle" type="info" icon="md-cloud-download" @click="handleExportToCloudbae(vm)">导出摇号池数据</Button>
        </Col>
        <Col span="8">
          <ButtonGroup style="float:right">
            <Button icon="md-search" @click="handleSearchable(vm)"></Button>
            <Button icon="md-refresh" @click="handleRefresh(vm)"></Button>
          </ButtonGroup>
        </Col>
     </Row>
     <Table
     @on-selection-change='handleSelectionChange(...arguments, vm)'
     :loading="loading" stripe :columns="columns" :data="tableData"></Table>
      <Page class="mld-page"
      :current='pageIndex'
      :page-size='pageSize'
      @on-change='handlePageIndexChange(...arguments, vm)'
      @on-page-size-change='handlePageSizeChange(...arguments, vm)'
      show-total
      show-elevator
      show-sizer
      transfer
      style="margin-top:10px;"
      :prev-text="vm.$t('prev-text')" :next-text="vm.$t('next-text')" :total="recordCount"></Page>
    </Card>
</template>

<script>
import MldSearch from './components/search'
import handleBtns from './handle-btns'
import methods from './methods'
export default {
  components: {
    MldSearch
  },
  data () {
    return {
      modalAdd: true,
      searchable: false,
      fullscreen: false,
      loading: false,
      pageIndex: this.$config.pageIndex,
      pageSize: this.$config.pageSize,
      recordCount: 0,
      selection: [],
      columns: [
        {type: 'selection', width: 60, align: 'center'},
        {
          title: '渠道',
          key: 'channel',
          render: (h, params) => {
            var s = ''
            if (params.row.channel === 10) {
              s = '微信公众号'
            } else if (params.row.channel === 20) {
              s = '市民卡app'
            }
            return h('div', s)
          }
        },
        {
          title: '姓名',
          key: 'realName',
          render: (h, params) => {
            return h('div', params.row.realName)
          }
        },
        {
          title: '身份证',
          key: 'idCard',
          render: (h, params) => {
            return h('div', params.row.idCard)
          }
        },
        {
          title: '手机号',
          key: 'mobilePhone',
          render: (h, params) => {
            return h('div', params.row.mobilePhone)
          }
        },
        {
          title: '药店名称',
          key: 'shopName',
          render: (h, params) => {
            return h('div', params.row.shopName)
          }
        },
        {
          title: '状态',
          key: 'status',
          width: 90,
          render: (h, params) => {
            /* 申请状态(
              10->初建|CREATE,
              15->等待摇号|WAIT_LOT,
              20->已命中|HITED,
              25->已发送|SENDED,
              30->已核销|FINISHED,
              35->已废弃|OBSOLETE,
              40->已过期|EXPIRED)
            */
            var s = '未知'
            if (params.row.status === 10) {
              s = '初建'
            } else if (params.row.status === 15) {
              s = '等待摇号'
            } else if (params.row.status === 20) {
              s = '已命中'
            } else if (params.row.status === 25) {
              s = '已发送'
            } else if (params.row.status === 30) {
              s = '已核销'
            } else if (params.row.status === 35) {
              s = '已废弃'
            } else if (params.row.status === 40) {
              s = '已过期'
            }
            return h('div', s)
          }
        },
        {
          title: '是否删除',
          key: 'isDeleted',
          width: 100,
          render: (h, params) => {
            return h('i-switch', {
              props: {
                value: params.row.isDeleted,
                'true-value': 0,
                'false-value': 1,
                disabled: true
              },
              on: {
                'on-change': (value) => {
                  // params.row.isLocked = value
                }
              }
            })
          }
        },
        {
          title: '预约时间',
          width: 150,
          key: 'createTime',
          render: (h, params) => {
            return h('div', params.row.createTime)
          }
        },
        {
          title: '卡券有效期',
          width: 150,
          key: 'startTime',
          render: (h, params) => {
            if (params.row.startTime && params.row.endTime) {
              return h('div', [h('div', '开始：' + params.row.startTime), h('div', '结束：' + params.row.endTime)])
            } else {
              return h('div', '未设置')
            }
          }
        },
        {
          title: '清洗标识',
          key: 'cleanFlag',
          width: 90,
          render: (h, params) => {
            /* 清洗标识(10->未清洗|NO_CLEAN,
            15->姓名不一致|NAME_DIFF,
            20->数据正常|NORMAL,
            25->线上线下无数据|NO_DATA,
            45->同手机号重名|ALIKE_MOBILE)
            */
            var s = '未知'
            if (params.row.cleanFlag === 10) {
              s = '未清洗'
            } else if (params.row.cleanFlag === 15) {
              s = '姓名不一致'
            } else if (params.row.cleanFlag === 20) {
              s = '数据正常'
            } else if (params.row.cleanFlag === 25) {
              s = '线上线下无数据'
            } else if (params.row.cleanFlag === 45) {
              s = '同手机号重名'
            }
            return h('div', s)
          }
        },
        {
          title: this.$t('handle'),
          width: 140,
          key: 'handle',
          align: 'center',
          render: (h, params) => {
            return h('div', handleBtns.map(item => item(h, params, this)))
          }
        }
      ],
      tableData: []
    }
  },
  created () {
    this.vm = this
  },
  methods: Object.assign({}, methods, {
    // ...methods,
  }),
  mounted () {
    this.requestData(this)
  }
}
</script>

<style>
</style>
